<script setup lang="ts">
import type { OptionItem } from '@/types/common';

interface IProps {
  tranposList: OptionItem[];
  logistList: OptionItem[];
  userList: OptionItem[];
  reasonList: OptionItem[];
  showStates: {
    address: boolean;
    logistics: boolean;
    user: boolean;
    reason: boolean;
  };
  selectHandlers: {
    address: (item: OptionItem) => void;
    logistics: (item: OptionItem) => void;
    user: (item: OptionItem) => void;
    reason: (item: OptionItem) => void;
  };
  closeHandlers: {
    address: () => void;
    logistics: () => void;
    user: () => void;
    reason: () => void;
  };
}

const props = defineProps<IProps>();
</script>

<template>
  <app-action-sheet
    :show="showStates.address"
    :actions="tranposList"
    @select="selectHandlers.address"
    @close="closeHandlers.address"
  />
  <app-action-sheet
    :show="showStates.logistics"
    :actions="logistList"
    @select="selectHandlers.logistics"
    @close="closeHandlers.logistics"
  />
  <app-action-sheet
    :show="showStates.user"
    :actions="userList"
    @select="selectHandlers.user"
    @close="closeHandlers.user"
  />
  <app-action-sheet
    :show="showStates.reason"
    :actions="reasonList"
    @select="selectHandlers.reason"
    @close="closeHandlers.reason"
  />
</template>
